<template>
	<view class="box">
		<uNavbar title="新生钱包" bgColor="transparent"></uNavbar>
		<view style="width: 750rpx;height: 50rpx;margin-top: 80rpx;"></view>
		<view class="title">
			可提现余额（元）
		</view>
		<view class="num">
			{{xs.balAmount}}
		</view>
		<view class="main">
			<view class="main_item" @click="gotopup">
				<image src="/static/icon/wallettx1.png" mode=""></image>
				<text class="text">充值</text>
				<uni-icons type="right" color="#666666" class="icon"></uni-icons>
			</view>
			<view class="main_item" @click="gowithdraw">
				<image src="/static/icon/wallettx1.png" mode=""></image>
				<text class="text">提现</text>
				<uni-icons type="right" color="#666666" class="icon"></uni-icons>
			</view>
			<view class="main_item" @click="gobanklist">
				<image src="/static/icon/walletyhk1.png" mode=""></image>
				<text class="text">银行卡</text>
				<uni-icons type="right" color="#666666" class="icon"></uni-icons>
			</view>
			<view class="main_item" @click="goFinancialDetails">
				<image src="/static/icon/left13.png" mode=""></image>
				<text class="text">资金明细</text>
				<uni-icons type="right" color="#666666" class="icon"></uni-icons>
			</view>
		</view>
	</view>

</template>

<script>
	import {myAccount} from "../../api/wallet.js"
	export default {
		data() {
			return {
				type:'',
				xs:{}
			}
		},
		onLoad(e) {
			this.getmyAccount()
		},
		methods: {
			gotopup(){
				uni.navigateTo({
					url:"/pagesMy/mywallet/topup"
				})
			},
			gowithdraw(){
				uni.navigateTo({
					url:"/pagesMy/mywallet/withdraw"
				})
			},
			gobanklist(){
				uni.navigateTo({
					url:"/pagesMy/mywallet/banklist"
				})
			},
			goFinancialDetails(){
				uni.navigateTo({
					url:"/pagesMy/mywallet/financialDetails"
				})
			},
			getmyAccount(){
				myAccount().then(res=>{
					this.xs=res.data.xs
			
				})
			},
			
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		width: 750rpx;
		height: 100vh;
		background-color:#E0DDDA;
	}
	.title{
		width: 750rpx;
		text-align: center;
		font-weight: 400;
		font-size: 28rpx;
		color: #666666;
	}
	.num{
		font-weight: 400;
		font-size: 80rpx;
		color: #333333;
		text-align: center;
		margin-top: 40rpx;
	}
	.main{
		width: 670rpx;
		margin: 0 auto;
		margin-top: 100rpx;
		.main_item{
			display: flex;
			align-items: center;
			width: 670rpx;
			height: 88rpx;
			background: #F2F2F2;
			border-radius: 12rpx 12rpx 12rpx 12rpx;
			// border: 2rpx solid #48397A;
			margin-bottom: 30rpx;
			>image{
				width: 44rpx;
				height: 44rpx;
				margin-left: 24rpx;
			}
			.text{
				width: 200rpx;
				margin-left: 20rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #333333;
			}
			.icon{
				margin-left: 336rpx;
			}
		}
	}
</style>